<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head th:include="common/head :: htmlhead">

<body>
<link rel="stylesheet" th:href="@{/static/layui/css/login.css}" >

<style>
    .layui-form-label{
        width: 80px;
    }
    .layui-input-block {
        margin-left: 110px;
        min-height: 36px
    }
</style>
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-card-header" style="font-size:large">其他单位会员注册</div>
        <div class="layui-card-body">
            <form class="layui-form" action="" lay-filter="component-form-group">
                <div class="layadmin-user-login-box layadmin-user-login-body layui-form layui-col-md3">
                    <div class="layui-form-item">
                        <label class="layadmin-user-login-icon layui-icon layui-icon-username"></label>
                        <input type="text" name="username" lay-verify="checkusername" placeholder="请输入用户名"
                               class="layui-input">
                    </div>
                    <div class="layui-form-item">
                        <label class="layadmin-user-login-icon layui-icon layui-icon-password"></label>
                        <input type="password" name="password" id="password" lay-verify="required"
                               placeholder="请输入密码" class="layui-input">
                    </div>
                    <div class="layui-form-item">
                        <label class="layadmin-user-login-icon layui-icon layui-icon-password"></label>
                        <input type="password" id="repwd" lay-verify="repass"
                               placeholder="请确认密码" class="layui-input">
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-row">
                            <div class="layui-col-xs7">
                                <label class="layadmin-user-login-icon layui-icon layui-icon-vercode"></label>
                                <input type="text" name="code" lay-verify="required"
                                       placeholder="图形验证码" class="layui-input">
                            </div>
                            <div class="layui-col-xs5">
                                <div style="margin-left: 10px;">
                                    <img id="codeimg" class="layadmin-user-login-codeimg" title="点击换一个" th:src="@{/createCode}" onclick="changeImg()">
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <input type="checkbox" id="agreement" lay-verify="agreement" lay-skin="primary" title="同意联盟章程">
                        <a class="layadmin-user-jump-change layadmin-link" style="margin-top: 7px;" >《工业博物馆联盟章程》</a>

                    </div>
                </div>
                <hr/>


                <!--第一行：名称和类型-->
                <div class="layui-row layui-col-lg12 layui-form-item">
                    <div class="layui-col-lg6">
                        <label class="layui-form-label">名称</label>
                        <div class="layui-input-block">
                            <input type="text" name="name" lay-verify="required" placeholder="输入名称"
                                   autocomplete="off" class="layui-input">
                        </div>
                    </div>
                    <div class="layui-col-lg6">
                        <label class="layui-form-label">单位类型</label>
                        <div class="layui-input-block">
                            <select name="unittype" lay-verify="required">
                                <option value=""></option>
                                <option value="0">有限责任公司</option>
                                <option value="1">股份有限公司</option>
                                <option value="2">其他企业法人</option>
                                <option value="3">个人独资企业</option>
                                <option value="4">合伙企业</option>
                                <option value="5">不具有法人资格的专业服务机构</option>
                                <option value="6">事业单位</option>
                                <option value="7">社会团体</option>
                                <option value="8">基金会</option>
                                <option value="9">社会服务机构</option>
                                <option value="10">机关法人</option>
                                <option value="11">农村集体经济组织法人</option>
                                <option value="12">城镇农村的合作经济组织法人</option>
                                <option value="13">基层群众性自治组织法人</option>
                            </select>
                        </div>
                    </div>
                </div>
                <!--第二行：联系人和职务-->
                <div class="layui-row layui-col-lg12 layui-form-item">
                    <div class="layui-col-lg6">
                        <label class="layui-form-label">联系人</label>
                        <div class="layui-input-block">
                            <input type="text" name="linker" lay-verify="required" placeholder=""
                                   autocomplete="off" class="layui-input">
                        </div>
                    </div>
                    <div class="layui-col-lg6">
                        <label class="layui-form-label">职务</label>
                        <div class="layui-input-block">
                            <input type="text" name="linkerjob" lay-verify="required" placeholder=""
                                   autocomplete="off" class="layui-input">
                        </div>
                    </div>
                </div>
                <!--第三行：手机座机-->
                <div class="layui-row layui-col-lg12 layui-form-item">
                    <div class="layui-col-lg6">
                        <label class="layui-form-label">手机</label>
                        <div class="layui-input-block">
                            <input type="text" name="mobilephone" lay-verify="required" placeholder=""
                                   autocomplete="off" class="layui-input">
                        </div>
                    </div>
                    <div class="layui-col-lg6">
                        <label class="layui-form-label">座机</label>
                        <div class="layui-input-block">
                            <input type="text" name="phone" lay-verify="required" placeholder=""
                                   autocomplete="off" class="layui-input">
                        </div>
                    </div>
                </div>

                <!--第四行：传真邮箱-->
                <div class="layui-row layui-col-lg12 layui-form-item">
                    <div class="layui-col-lg6">
                        <label class="layui-form-label">传真</label>
                        <div class="layui-input-block">
                            <input type="text" name="fax" lay-verify="required" placeholder=""
                                   autocomplete="off" class="layui-input">
                        </div>
                    </div>
                    <div class="layui-col-lg6">
                        <label class="layui-form-label">电子邮箱</label>
                        <div class="layui-input-block">
                            <input type="text" name="email" lay-verify="email" placeholder=""
                                   autocomplete="off" class="layui-input">
                        </div>
                    </div>
                </div>

                <!--第五行：地址-->
                <div class="layui-row layui-col-lg12 layui-form-item">
                    <div class="layui-col-lg6" id="area-picker">
                        <label class="layui-form-label">省市</label>
                        <div class="layui-input-inline layui-col-lg3">
                            <select name="province" class="province-selector" lay-filter="province-1">
                                <option value="">请选择省</option>
                            </select>
                        </div>
                        <div class="layui-input-inline layui-col-lg3" >
                            <select name="city" class="city-selector" lay-filter="city-1">
                                <option value="">请选择市</option>
                            </select>
                        </div>
                    </div>
                    <div class="layui-col-lg6">
                        <label class="layui-form-label">详细地址</label>
                        <div class="layui-input-block">
                            <input type="text" name="address" lay-verify="required" placeholder="填写市以后的地址"
                                   autocomplete="off" class="layui-input">
                        </div>
                    </div>
                </div>
                <!--第六行：邮编-->
                <div class="layui-row layui-col-lg12 layui-form-item">
                    <div class="layui-col-lg6">
                        <label class="layui-form-label">邮编</label>
                        <div class="layui-input-block">
                            <input type="text" name="postcode" lay-verify="required" placeholder=""
                                   autocomplete="off" class="layui-input">
                        </div>
                    </div>
                </div>

                <!--第七行：成立时间、注册资本-->
                <div class="layui-row layui-col-lg12 layui-form-item">
                    <div class="layui-col-lg6">
                        <label class="layui-form-label">成立时间</label>
                        <div class="layui-input-block">
                            <input type="text" name="founddate" lay-verify="required" placeholder=""
                                   autocomplete="off" class="layui-input" id="date1">
                        </div>
                    </div>
                    <div class="layui-col-lg6">
                        <label class="layui-form-label">注册资本</label>
                        <div class="layui-input-block">
                            <input type="text" name="registerasset" lay-verify="required" placeholder="万元"
                                   autocomplete="off" class="layui-input">
                        </div>
                    </div>
                </div>

                <!--第八行：法人代表、统一社会信用代码-->
                <div class="layui-row layui-col-lg12 layui-form-item">
                    <div class="layui-col-lg6">
                        <label class="layui-form-label">法人代表</label>
                        <div class="layui-input-block">
                            <input type="text" name="faren" lay-verify="required" placeholder=""
                                   autocomplete="off" class="layui-input">
                        </div>
                    </div>
                    <div class="layui-col-lg6">
                        <label class="layui-form-label">  统一社会信用代码</label>
                        <div class="layui-input-block">
                            <input type="text" name="creditcode" lay-verify="required" placeholder=""
                                   autocomplete="off" class="layui-input">
                        </div>
                    </div>
                </div>

                <!--第九行：官网、组织机构代码-->
                <div class="layui-row layui-col-lg12 layui-form-item">
                    <div class="layui-col-lg6">
                        <label class="layui-form-label">官网</label>
                        <div class="layui-input-block">
                            <input type="text" name="officialweb" lay-verify="required" placeholder=""
                                   autocomplete="off" class="layui-input">
                        </div>
                    </div>
                    <div class="layui-col-lg6">
                        <label class="layui-form-label">  组织机构代码</label>
                        <div class="layui-input-block">
                            <input type="text" name="groupid" lay-verify="required" placeholder=""
                                   autocomplete="off" class="layui-input">
                        </div>
                    </div>
                </div>

                <!--第十二行： 从业人数-->
                <div class="layui-row layui-col-lg12 layui-form-item">
                    <div class="layui-col-lg6">
                        <label class="layui-form-label">从业人数</label>
                        <div class="layui-input-block">
                            <input type="text" name="employeenum" lay-verify="required" placeholder="人"
                                   autocomplete="off" class="layui-input">
                        </div>
                    </div>
                </div>


                <!--第十四行：业务范围-->
                <div class="layui-row layui-col-lg12 layui-form-item">
                    <div class="layui-col-lg12">
                        <label class="layui-form-label">业务范围</label>
                        <div class="layui-input-block">
                            <input type="text" name="businessrange" lay-verify="required" placeholder=""
                                   autocomplete="off" class="layui-input">
                        </div>
                    </div>
                </div>

                <!--第十五行：单位简介-->
                <div class="layui-row layui-col-lg12 layui-form-item">
                    <div class="layui-col-lg12">
                        <label class="layui-form-label">单位简介</label>
                        <div class="layui-input-block">
                            <textarea name="groupintroduct" placeholder="重点介绍与博物馆工作有关情况" class="layui-textarea"></textarea>
                        </div>
                    </div>
                </div>

                <!--提交&重置-->
                <div class="layui-form-item layui-layout-admin">
                    <div class="layui-input-block">
                        <button type="button" class="layui-btn" onclick="location.href='/login'">返回登录</button>
                        <button class="layui-btn" lay-submit="" lay-filter="component-form-demo1">立即提交</button>
                        <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                    </div>
                </div>

            </form>
        </div>
    </div>
</div>
<script type="text/javascript" th:src="@{/static/js/hangye.js}"></script>

<script type="text/javascript">
    function changeImg(){
        var img = document.getElementById('codeimg');
        img.src = "/createCode?d=" + Math.floor(Math.random()*100)
    }

    layui.config({
        base: '/static/lib/' //静态资源所在路径
    }).use(['index', 'form','layarea'], function(){
        var $ = layui.$
            ,admin = layui.admin
            ,element = layui.element
            ,layer = layui.layer
            ,laydate = layui.laydate
            ,layarea = layui.layarea
            ,form = layui.form;

        layarea.render({
            elem: '#area-picker',
            change: function (res) {
                //选择结果
                console.log(res);
            }
        });

        layui.use('laydate', function(){
            var laydate = layui.laydate;
            //执行一个laydate实例
            laydate.render({
                elem: '#date1' //指定元素
                ,format: 'yyyy/MM/dd'
            });
        });

        form.render(null, 'component-form-group');

        /* 自定义验证规则 */
        form.verify({
            checkusername:function(value){
                var datas={"username": value};
                var message = '';
                $.ajax({
                    type: "POST",
                    url: "/checkUsername", //(对应后台的方法)
                    async: false, //改为同步请求
                    dataType: "text",
                    data: datas,
                    success: function (data) {
                        message = data;
                    }
                });
                if (message === "duplicate") {
                    return "用户名重复！";
                }
                //需要注意 需要将返回信息写在ajax方法外

            },repass: function(value) {
                var password = $("#password").val();
                if(value !== password){
                    return '两次密码不一致';
                }
            },city:function(value){
                if(value === "-1"){
                    return "请选择省市";
                }
            }, agreement:function () {
                if(!$('#agreement').is(':checked')) {
                    $('#agreement').focus();
                    return "请阅读博物馆章程并勾选同意按钮!";
                }
            }
        });

        form.on("submit(component-form-demo1)",function (data) {
            $.ajax({
                url:"/registeroth",
                async: false,
                type:"POST",
                dataType: "text",
                data:data.field,
                success: function(data){
                    if(data==="codeError"){
                        layer.msg('验证码输入错误！', {icon: 2});
                    }else if(data==="success"){
                        layer.open({
                            title: '提交成功'
                            ,content: '提交成功，请登录后下载审核文件，盖章上传！'
                            ,yes: function(index, layer){
                                location.href="/login";
                            }
                        });


                    }
                }
            });
            return false;
        });

    });
</script>


</body>
</html>


